<!DOCTYPE html>
<html>
<head>
  <title>TEST</title>

    <script src="angular1.3.min.js" type="text/javascript"></script>
    <script src="../js/angular-local-storage.min.js"></script>


 </head>
<body>


    <div class="container" ng-app="testInOne">

        <div class="hero-unit">
            <h1>Give it a try</h1>

            <div ng-controller="DemoCtrl">
                <p><input type="text" ng-model="localStorageDemo" placeholder="Start typing..."></p>


                    <p>{{localStorageDemoValue}}</p>
                    <small>storegeType: {{storageType}} value </small>

            </div>

            <p>The Angular Local Storage Module is meant to be a plug-and-play Angular module for accessing the browsers Local Storage API.</p>

        </div>

        <p>Angular Local Storage offers you access to the browser local storage API through Angular but also allows has the following features:</p>

        <ul>
            <li>Control local storage access through key prefices (e.g. "myApp.keyName")</li>
            <li>Checks browser support and falls back to cookies for antiquated browsers</li>
            <li>Allows programmatic access to remove all keys for a given app</li>
        </ul>

        <h6>JS Example</h6>
  <pre class="prettyprint lang-js">
var YourCtrl = function($scope, localStorageService, ...) {
  // To add to local storage
  localStorageService.set('localStorageKey','Add this!');
  // Read that value back
  var value = localStorageService.get('localStorageKey');
  // To remove a local storage
  localStorageService.remove('localStorageKey');
  // Removes all local storage
  localStorageService.clearAll();
  // You can also play with cookies the same way
  localStorageService.cookie.set('localStorageKey','I am a cookie value now');
}</pre>

        <h3>API Access</h3>

        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th>Call</th>
                <th>Arguments</th>
                <th>Action</th>
                <th>Returns</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td><code>isSupported</code></td>
                <td class="muted"><small>n/a</small></td>
                <td>Checks the browsers support for local storage</td>
                <td>Boolean for success</td>
            </tr>
            <tr>
                <td><code>set</code></td>
                <td><small>key, value</small></td>
                <td>Adds a key-value pair to the browser local storage</td>
                <td>Boolean for success</td>
            </tr>
            <tr>
                <td><code>get</code></td>
                <td><small>key</small></td>
                <td>Gets a value from local storage</td>
                <td>Stored value</td>
            </tr>
            <tr>
                <td><code>remove</code></td>
                <td><small>key</small></td>
                <td>Removes a key-value pair from the browser local storage</td>
                <td>Boolean for success</td>
            </tr>
            <tr>
                <td><code>clearAll</code></td>
                <td class="muted">n/a</td>
                <td><span class="label label-warning">Warning</span> Removes all local storage key-value pairs for this app. It will optionally take a string, which is converted to a regular expression, and then clears keys based on that regular expression.</td>
                <td>Boolean for success</td>
            </tr>
            <tr>
                <td><code>cookie</code></td>
                <td><small>set | get | remove | clearAll</small></td>
                <td>Each function within cookie uses the same arguments as the coresponding local storage functions</td>
                <td>n/a</td>
            </tr>
            </tbody>
        </table>

    </div>


</body>
</html>

<script>
    var app = angular.module('testInOne',['LocalStorageModule']);
    app.config(['localStorageServiceProvider', function(localStorageServiceProvider){
        localStorageServiceProvider.setPrefix('demoPrefix');
        // localStorageServiceProvider.setStorageCookieDomain('example.com');
        // localStorageServiceProvider.setStorageType('sessionStorage');
    }]);

    app.controller('DemoCtrl',   [ '$scope', 'localStorageService',
        function($scope, localStorageService) {
            $scope.storageType = 'Local storage';
            if (localStorageService.getStorageType().indexOf('session') >= 0) {
                $scope.storageType = 'Session storage';
            }
            if (!localStorageService.isSupported) {
                $scope.storageType = 'Cookie';
            }

            $scope.localStorageDemo = localStorageService.get('localStorageDemo');

            $scope.$watch('localStorageDemo', function(value){
                localStorageService.set('localStorageDemo',value);
                $scope.localStorageDemoValue = localStorageService.get('localStorageDemo');
            });

        }
    ]);

</script>
